import React from 'react';
import FormSection from './FormSection';
import Icon from '../Icon';
import './EditContainer.css';

const EditContainer = ({
  title = "论文信息",
  icon = "default",
  onCustomize = () => {},
  children,
  className = ''
}) => {
  return (
    <div className={`edit-container ${className}`}>
      <div className="edit-container__content">
        <div className="edit-container__section">
          <div className="edit-container__section-header">
            <div className="edit-container__section-icon">
              <Icon name={icon} size={24} />
            </div>
            <h2 className="edit-container__section-title">{title}</h2>
            <button className="edit-container__customize-btn" onClick={onCustomize}>
              <span className="edit-container__customize-icon">+</span>
              自定义列
            </button>
          </div>
          
          <div className="edit-container__form">
            {children}
          </div>
        </div>
      </div>
    </div>
  );
};

export default EditContainer;
